<template>
  <div class="cell-box"  >
    <div class="cell-order">类目：{{ ListData.infoTypeName }}</div>
    <div class="cell-top flex space-between">
      <div class="h1 flex flex-start">品名：{{ ListData.keyword }}</div>
      <p class="time">数量：{{ ListData.stock }}吨</p>
    </div>
    <div class="cell-bottom flex space-between">
      <div class="cell-bottom-left">
        地域：{{ ListData.placeOfOrigin }}
         <!-- {{ ListData.time }} -->
         </div>
      <div class="cell-bottom-right price-box">
      <!-- <i>以实际费用为准</i> -->
        <span class="red">￥{{ ListData.unitPrice }}元</span>
      </div>
    </div>
    <!-- <div class="cell-bottom cell-bottom-padd flex space-between">
      <p>{{ ListData.region }}</p>
      <p>{{ ListData.distance }}km</p>
    </div> -->
    <!-- <van-cell v-if="roles !== 'platform'" class="cell-detail" :title="ListData.user.remark"/> -->
  </div>
</template>

<script>
export default {
  props: {
    ListData: {
      type: Object,
      default: () => {}
    },
     roles: {
      type: String,
      default: ''//默认为快递员
    }
  },
  data() {
    return {
      
    };
  },
  methods: {

  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.cell-box {
  border-radius: 5px;
  padding: 0 0.3rem;
  box-sizing: border-box;
  background: #fff;
  margin-bottom: 0.3rem;
  font-size: 0.3rem;
  color: #999;
  background-position: right top;
  background-repeat: no-repeat;
  background-size:1.25rem; 
 .cell-order {
    padding: 0.3rem 0;
    text-align: left;
    color: #1C1C1C;
     border-bottom: 0.5px solid #d8d8d8;
 }
  .cell-top {
    padding-top: 0.2rem;
    .h1 {
      max-width: 80%;
      color: #1ba447;
      align-items: center;
      span {
        font-size: 0.24rem;
        color: #999;
        padding-left: 0.3rem;
      }
    }
    .time {
      min-width: 1.1rem;
      text-align: center;
    }
  }
  .cell-bottom {
    text-align: left;
    padding: 0.2rem 0;
    .cell-bottom-left {
      color: #1c1c1c;
    }
    
    .price-box{
      i{
        font-size: .2rem
      }
    }
    .btn-call {
      background: #1ba447;
      min-width: 1.56rem;
      line-height: 0.6rem;
      text-align: center;
      border-radius: 0.3rem;
      color: #fff;
      font-size: 0.24rem;
      img {
        margin-right: 5px;
        width: 0.17rem;
        vertical-align: middle;
      }
    }
    &.cell-bottom-padd{
      padding-bottom: .3rem;
    }
  }
  .cell-detail {
    padding-left: 0;
    padding-right: 0;
    border-top: 0.5px solid #d8d8d8;

    .van-cell__title {
      text-align: left;
      font-size: 0.28rem;
      color: #999;
    }
  }
}
</style>
